From 1eee181e219dfd993d396ac3169e7aad3dd285eb Mon Sep 17 00:00:00 2001 From: Factiven Date: Sun, 16 Jul 2023 22:35:39 +0700 Subject: Update v3.6.4 - Added Manga page with a working tracker for AniList user - Added schedule component to home page - Added disqus comment section so you can fight on each other (not recommended) - Added /id and /en route for english and indonesian subs (id route still work in progress) --- pages/id/search/[param].js | 493 +++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 493 insertions(+) create mode 100644 pages/id/search/[param].js (limited to 'pages/id/search/[param].js') diff --git a/pages/id/search/[param].js b/pages/id/search/[param].js new file mode 100644 index 0000000..00fab64 --- /dev/null +++ b/pages/id/search/[param].js @@ -0,0 +1,493 @@ +import { useEffect, useRef, useState } from "react"; +import { AnimatePresence, motion as m } from "framer-motion"; +import Skeleton, { SkeletonTheme } from "react-loading-skeleton"; +import { useRouter } from "next/router"; +import Link from "next/link"; +import Navbar from "../../../components/navbar"; +import Head from "next/head"; +import Footer from "../../../components/footer"; + +import Image from "next/image"; +import { ChevronDownIcon } from "@heroicons/react/24/outline"; +import { aniAdvanceSearch } from "../../../lib/anilist/aniAdvanceSearch"; + +const genre = [ + "Action", + "Adventure", + "Comedy", + "Drama", + "Ecchi", + "Fantasy", + "Horror", + "Mahou Shoujo", + "Mecha", + "Music", + "Mystery", + "Psychological", + "Romance", + "Sci-Fi", + "Slice of Life", + "Sports", + "Supernatural", + "Thriller", +]; + +const types = ["ANIME", "MANGA"]; + +const sorts = [ + { name: "Title", value: "TITLE_ROMAJI" }, + { name: "Popularity", value: "POPULARITY_DESC" }, + { name: "Trending", value: "TRENDING_DESC" }, + { name: "Favourites", value: "FAVOURITES_DESC" }, + { name: "Average Score", value: "SCORE_DESC" }, + { name: "Date Added", value: "ID_DESC" }, + { name: "Release Date", value: "START_DATE_DESC" }, +]; + +export default function Card() { + const router = useRouter(); + + const [data, setData] = useState(); + const [loading, setLoading] = useState(true); + + let hasil = null; + let tipe = "ANIME"; + let s = undefined; + let y = NaN; + let gr = undefined; + + const query = router.query; + gr = query.genres; + + if (query.param !== "anime" && query.param !== "manga") { + hasil = query.param; + } else if (query.param === "anime") { + hasil = null; + tipe = "ANIME"; + if ( + query.season !== "WINTER" && + query.season !== "SPRING" && + query.season !== "SUMMER" && + query.season !== "FALL" + ) { + s = undefined; + y = NaN; + } else { + s = query.season; + y = parseInt(query.seasonYear); + } + } else if (query.param === "manga") { + hasil = null; + tipe = "MANGA"; + if ( + query.season !== "WINTER" && + query.season !== "SPRING" && + query.season !== "SUMMER" && + query.season !== "FALL" + ) { + s = undefined; + y = NaN; + } else { + s = query.season; + y = parseInt(query.seasonYear); + } + } + + // console.log(tags); + + const [search, setQuery] = useState(hasil); + const [type, setSelectedType] = useState(tipe); + // const [genres, setSelectedGenre] = useState(); + const [sort, setSelectedSort] = useState(); + + const [isVisible, setIsVisible] = useState(false); + + const inputRef = useRef(null); + + const [page, setPage] = useState(1); + const [nextPage, setNextPage] = useState(true); + + async function advance() { + setLoading(true); + const data = await aniAdvanceSearch({ + search: search, + type: type, + genres: gr, + page: page, + sort: sort, + season: s, + seasonYear: y, + }); + if (data.media.length === 0) { + setNextPage(false); + } else if (data !== null && page > 1) { + setData((prevData) => { + return [...(prevData ?? []), ...data.media]; + }); + setNextPage(data.pageInfo.hasNextPage); + } else { + setData(data.media); + } + setNextPage(data.pageInfo.hasNextPage); + setLoading(false); + } + + useEffect(() => { + setData(null); + setPage(1); + setNextPage(true); + advance(); + }, [search, type, sort, s, y, gr]); + + useEffect(() => { + advance(); + }, [page]); + + useEffect(() => { + function handleScroll() { + if (page > 10 || !nextPage) { + window.removeEventListener("scroll", handleScroll); + return; + } + + if ( + window.innerHeight + window.pageYOffset >= + document.body.offsetHeight - 3 + ) { + setPage((prevPage) => prevPage + 1); + } + } + + window.addEventListener("scroll", handleScroll); + + return () => window.removeEventListener("scroll", handleScroll); + }, [page, nextPage]); + + const handleKeyDown = async (event) => { + if (event.key === "Enter") { + event.preventDefault(); + const inputValue = event.target.value; + if (inputValue === "") { + setQuery(null); + } else { + setQuery(inputValue); + } + } + }; + + function trash() { + setQuery(null); + inputRef.current.value = ""; + // setSelectedGenre(null); + setSelectedSort(["POPULARITY_DESC"]); + router.push(`/search/${tipe.toLocaleLowerCase()}`); + } + + function handleVisible() { + setIsVisible(!isVisible); + } + + function handleTipe(e) { + setSelectedType(e.target.value); + router.push(`/search/${e.target.value.toLowerCase()}`); + } + + // ); + + return ( + <> + + Moopa - search + + +
+ +
+
+
+

+ TITLE +

+ +
+ + {/* TYPE */} +
+

+ TYPE +

+
+ + +
+
+ + {/* SORT */} +
+

+ SORT +

+
+ + +
+
+ + {/* OPTIONS */} +
+
+ + + +
+ + {/* TRASH ICON */} +
+ + + +
+
+
+ +
+ + {isVisible && ( + +
+

+ GENRE +

+
+ + +
+
+
+

+ TYPE +

+
+ + +
+
+ +
+

+ SORT +

+
+ + +
+
+ + )} + +
+ {gr && ( +
+

+ Looking for : {gr} +

+
+ )} +
+ +
+ {loading + ? "" + : !data?.length && ( +
+ Oops!

Nothing's Found... +
+ )} + {data && + data?.map((anime, index) => { + return ( + + + {anime.title.userPreferred} + + +

+ {anime.status === "RELEASING" ? ( + + ) : anime.status === "NOT_YET_RELEASED" ? ( + + ) : null} + {anime.title.userPreferred} +

+ +

+ {anime.format ||

-

} ·{" "} + {anime.status ||

-

} ·{" "} + {anime.episodes || 0} Episodes +

+ + ); + })} + + {loading && ( + <> + + {[1, 2, 4, 5, 6, 7, 8].map((item) => ( +
+ + +
+ ))} + + + )} +
+ {!loading && page > 10 && nextPage && ( + + )} + +
+
+
+ + ); +} -- cgit v1.2.3